<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page trimDirectiveWhitespaces="true" %>
<%@ page session="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<%@ page trimDirectiveWhitespaces="true" %>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>送养</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/reset1.css">
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/index.css">
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/indexseo.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/bootstrap.min.css" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/css/style3.css" />
<script src="${pageContext.request.contextPath }/js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/bootstrap.min.js" ></script>
<script src="${pageContext.request.contextPath }/js/jquery-form.js"></script>
<script src="${pageContext.request.contextPath }/js/slider.js"></script>
<script src="${pageContext.request.contextPath }/js/navChange.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.validate.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/messages_zh.js" ></script>

<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.cookie.js"></script>
<!--kindeditor的js  -->
<script charset="utf-8" src="${pageContext.request.contextPath }/js/kindeditor/kindeditor-all-min.js" type="text/javascript"></script>
<script charset="utf-8" src="${pageContext.request.contextPath }/js/kindeditor/lang/zh-CN.js" type="text/javascript"></script>

<script type="text/javascript">  
			var editor;
			KindEditor.ready(function(K) {
			  editor = K.create('textarea[name="sentpdesc"]', {
				  /* items:["undo","redo","|","image","|","preview","|","print","|","cut","copy","paste","plainpaste","wordpaste","|","justifyleft","justifyright","justifyfull","|","insertorderedlist"], */
				  	items: ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
                'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
                'insertunorderedlist', '|', 'emoticons', 'image', 'link','|','preview'],
				  afterBlur:function(){this.sync();},
			       resizeType: 1,
			        <%-- uploadJson : '+<%=basePath%>+'AdminNews/uploadvvv',// 上传图片接口  项目名（此处项目名是wenjiqiwu）+上传图片的路径
	                filePostName: 'imgFile',// name属性默认值  --%>
			       allowPreviewEmoticons: false
			    });
			    
			});
</script>
<script type="text/javascript">
var E3MALL = {
		checkLogin : function(){
			var _ticket = $.cookie("token");
			if(!_ticket){
				return ;
			}
			$.ajax({
				url : "${pageContext.request.contextPath }/user/token/" + _ticket,
				dataType : "jsonp",
				type : "GET",
				success : function(data){
					if(data.status == 200){
						var username = data.data.username;
						/* alert("hello"+username); */
						/* var html = username + "，欢迎您！<a href=\"http://www.e3mall.cn/user/logout.html\" class=\"link-logout\">[退出]</a>"; */
						var html = "<div class='navbar-right' style='display: inline-block;padding-top: 10px;'>"+
				          "<div class=''>"+
				          	"<ol class='list-inline'>"+
				          		"<li>欢迎您,<font style='color: red;'>"+username+"</font></li>|"+
				          		"<li><a href='${pageContext.request.contextPath}/user/logout/"+_ticket+"' class='link-logout'>[退出]</a></li>"+
				          	"</ol>"+
				          "</div>"+
				          "</div>";
						$("#loginbar").html(html);
					}
				}
			});
		}
	}

	$(function(){
		// 查看是否已经登录，如果已经登录查询登录信息
		E3MALL.checkLogin();
	});
</script>

<!--表单校验-->
<script type="text/javascript">
	
        $.validator.addMethod("isPhone", function(value, element) {
          var length = value.length;
          var mobile = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1}))+\d{8})$/;
          return this.optional(element) || (length == 11 && mobile.test(value));
         }, "请填写正确的手机号码");
         /*表单校验*/
	$(function () {
				$("#sentPetForm").validate({
					rules:{
						sname:{
							required:true
							/*username:true*/
						},
						imgs:{
							required:true
						},
						skind:{
							required:true
							
						},
						ssex:{
							required:true
							
						},
						sage:{
							required:true
							
						},
						sweight:{
							required:true
							
						},
						sheath:{
							required:true
							
						},
						sman:{
							required:true
							
						},
						stel:{
							isPhone:true
						},
						semail:{
							email:true
						},
						sreason:{
							required:true
						},
						sdesc:{
							required:true
						}
					},
					messages:{
						sname:{
							required:"必填字段"
							/*username:"用户名已存在"*/
						},
						imgs:{
							required:"不能为空"
						},
						skind:{
							required:"不能为空"
						},
						ssex:{
							required:"必填"
							
						},
						sage:{
							required:"必填"
							
						},
						sweight:{
							required:"必填"
							
						},
						sheath:{
							required:"必填"
							
						},
						sman:{
							required:"必填"
							
						},
						stel:{
							isPhone:"请填写正确的手机号码"
						},
						semail:{
							email:"请输入正确的邮箱格式"
						},
						sreason:{
							required:"必选字段"
						},
						sdesc:{
							required:"必选字段"
						}
					}
				});
			});
	
</script>
<script type="text/javascript">
/*图片上传*/
function imgfun(){
	
	var obj = {
			url:"<%=basePath%>sent/uloadPic",
			dataType:"json",
			type:"post",
			success: function (result) {
				var objs;
				/* if((typeof result == 'object') && result.constructor == Object){
					objs = result;
				}else{
					objs = eval("("+result+")");
				} */
				$("#simage1").attr("width","220px");
				$("#simage1").attr("height","260px");
				$("#simage1").attr("src",result);
				$("#picc").val(result);
				$("#simage1").removeClass("hidden");
			}
	};			
	$("#sentPetForm").ajaxSubmit(obj);

}
</script>
<script type="text/javascript">
function savesetpet() {
	
	var flag = $("#sentPetForm").valid();
    if(!flag){
        //没有通过验证
        return;
    }
    $("#sdesc").val($("#sentpet_id").val());//信息同步
    $.post(
    		"<%=basePath%>sent/saveSent",
    		$("#sentPetForm").serialize(),
    		function (data) {
				alert("请求已接收!请留言邮箱信息");
				/* var yes = confirm("是否继续送养?"); */
				location.href="<%=basePath%>sent/sentList";
			}
    );
}
</script>
<style>
body {
	margin-top: 20px;
	margin: 0 auto;
}

.carousel-inner .item img {
	width: 100%;
	height: 300px;
}

.container .row div {
	/* position:relative;
				 float:left; */	
}

font {
	color: #666;
	font-size: 22px;
	font-weight: normal;
	padding-right: 17px;
	
  /* Make the image fully responsive */
.carousel-inner img {
     width: 100%;
     height: 100%;
}
</style>
</head>
<body style="overflow-x:hidden">

	<jsp:include page="/WEB-INF/jsp/head.jsp"></jsp:include>
		
		<div class="container" style="background: url(${pageContext.request.contextPath }/img/sentbg.jpg);background-size: cover; width: 100%;height:auto;">
			<div class="container-fluid" style="padding-left: 300px;">
				<div class="row" style="padding-top: 10px;padding-bottom: 30px;">
					<div class="col-md-2" ></div>
					<div class="col-md-8" style="background: #fff; border: 7px solid #ccc; width: 600px; height: auto;padding-top: 20px;">
									<font style="padding-left: 50px;">送养</font>
									<!--送养表单-->
								 <form class="form-horizontal" style="margin-top: 5px;" role="form" id="sentPetForm" method="post" enctype="multipart/form-data">	
										<div class="form-group">
											<label for="sname" class="col-sm-2 control-label">动物名:</label>
											<div class="col-sm-10">
												<input type="text" class="form-control" id="sname" name="sname" style="width: 150px;" placeholder="请输入名">
											</div>
										</div>
										
										<div class="form-group">
											<label for="simage1" class="col-sm-2 control-label">图片</label>
													<div class="col-sm-10">
														<img id="simage1" name="simage1" src="${pageContext.request.contextPath }/img/i.png" width="50px" height="50px" class="hidden"/>
														<input type="hidden" name="simage" id="picc" value="">
														<input type="file" name="imgs" id="imgs" onchange="imgfun()">
													</div>
										</div>
										
										<div class="form-group">
											<label for="skind" class="col-sm-2 control-label">品种</label>
													<div class="col-sm-10">
														<select id="skind" name="skind">
															<option value="1">狗狗</option>
															<option value="2">猫猫</option>
															<option value="3">其他</option>
														</select>
												</div>
										</div>
										
										<div class="form-group">
											<label for="ssex" class="col-sm-2 control-label">性别</label>
											<div class="col-sm-10">
												<select id="ssex" name="ssex">
													<option value="">--请选择--</option>
													<option value="1">男</option>
													<option value="2">女</option>
												</select>
											</div>
										</div>
										
										<div class="form-group">
											<label for="sage" class="col-sm-2 control-label">年龄</label>
											<div class="col-sm-10" style="display: inline-block;">
												<input type="text" class="form-control" id="sage" name="sage" style="width: 150px;" placeholder="宠物年龄...">
												
											</div>
											
										</div>
										
										<div class="form-group">
											<label for="sweight" class="col-sm-2 control-label">体重</label>
											<div class="col-sm-10">
												<input type="text" class="form-control" id="sweight" name="sweight" style="width: 150px;" placeholder="请输入体重...">
											</div>
										</div>
										
										<div class="form-group">
											<label for="sheath" class="col-sm-2 control-label">健康状况</label>
											<div class="col-sm-10">
												<select id="sheath" name="sheath">
													<option value="">--请选择--</option>
													<option value="1">合格</option>
													<option value="2">不合格</option>
												</select>
											</div>
										</div>
										
										<div class="form-group">
											<label for="sman" class="col-sm-2 control-label">送养人</label>
											<div class="col-sm-10">
												<input type="text" class="form-control" id="sman" name="sman" value="${user.username }" style="width: 150px;" placeholder="请输入...">
											</div>
										</div>
										
										<div class="form-group">
											<label for="stel" class="col-sm-2 control-label">联系方式</label>
											<div class="col-sm-10">
												<input type="text" class="form-control" id="stel" name="stel" value="${user.tel }" style="width: 150px;" placeholder="请输入联系方式...">
											</div>
										</div>
										
										<div class="form-group">
											<label for="semail" class="col-sm-2 control-label">邮箱</label>
											<div class="col-sm-10">
												<input type="text" class="form-control" id="semail" name="semail" value="${user.email }" style="width: 150px;" placeholder="请输入邮箱...">
											</div>
										</div>
										
										<div class="form-group">
											<label for="sreason" class="col-sm-2 control-label">送养原因</label>
											<div class="col-sm-10">
												<textarea style="width: 250px;height: 100px;" id="sreason" name="sreason"></textarea>
											</div>
										</div>
										
										<div class="form-group">
											<label for="sdesc" class="col-sm-2 control-label">描述</label>
											<div class="col-sm-10">
												<!-- <textarea style="width: 250px;height: 100px;" id="sdesc" name="sdesc"></textarea> -->
												<textarea id="sentpet_id" name="sentpdesc" style="width:80%;height:250px;border: 0 none;visibility:hidden;"></textarea>
            								<textarea rows="" cols="" name="sdesc" id="sdesc" style="width:80%;height:250px;display:none;"></textarea>
											</div>
										</div>
										
										<div class="form-group">
											<div class="col-sm-offset-2 col-sm-10">
												<button type="button" class="btn btn-primary" onclick="savesetpet()">提交申请</button>
											</div>
										</div>
									</form>
							</div>
					<div class="col-md-2" ></div>
				</div>
			</div>
		</div>

		<div class="" style="margin: auto;"></div>
		<!--底层-->
		<nav class="navbar-fixed-bottom">
			<header class="header" style="background-color: gainsboro">
		      <div class="container1">
		      	
		        <ul class="nav" style="padding-top: 5px;">
		          <li class="nav" style="display: inline;">
		            <p>CopyRight@201624131105</p>
		          </li>
		        </ul>
		        
		      </div>
		    </header>
		    </nav>
</body>
</html>